<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/zui/1.9.2/css/zui.min.css">
</head>

<body>
    <div class="page-container">
        <div class="site-content">
            <div class="shadow">
                <div class="desc">
                    <h1>ZUI后台管理系统模板</h1>
                    <p>本项目是使用ZUI构建的后台管理模板，模板简单易用，同时具备可扩展性，你可以任意修改模板以达到预期效果。</p>
                </div>
            </div>
        </div>
        <div class="login-main">
            <div>
                <ul class="nav nav-tabs">
                    <li class="active" id="login-nav"><a href="###" data-target="#login-pane" data-toggle="tab">登录</a></li>
                    <li id="register-nav"><a href="###" data-target="#register-pane" data-toggle="tab">注册</a></li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane fade active in" id="login-pane">
                        <form>
                            <table class="table table-form">
                                <tbody>
                                    <tr>
                                        <th>用户名</th>
                                        <td><input class="form-control" type="text" name="account" id="account" autofocus></td>
                                    </tr>
                                    <tr>
                                        <th>密码</th>
                                        <td><input class="form-control" type="password" name="password"></td>
                                    </tr>
                                    <tr>
                                        <th></th>
                                        <td>
                                            <a id="login-btn" class="btn btn-primary" data-loading="稍候...">登录</a>
                                            <span class="to-register"><a href="#">没有账号，去注册&gt;&gt;</a></span>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </form>
                    </div>
                    <div class="tab-pane fade" id="register-pane">
                        <form>
                            <table class="table table-form">
                                <tbody>
                                    <tr>
                                        <th>用户名</th>
                                        <td><input class="form-control" type="text" name="account" id="account" autofocus></td>
                                    </tr>
                                    <tr>
                                        <th>密码</th>
                                        <td><input class="form-control" type="password" name="password"></td>
                                    </tr>
                                    <tr>
                                        <th>确认密码</th>
                                        <td><input class="form-control" type="password" name="password"></td>
                                    </tr>
                                    <tr>
                                        <th></th>
                                        <td>
                                            <a id="register-btn" class="btn btn-primary">注册</a>
                                            <span class="to-login"><a href="#">已有账号，去登录&gt;&gt;</a></span>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/zui/1.9.2/lib/jquery/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/zui/1.9.2/js/zui.min.js"></script>
</body>

</html>